<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
<%@include file="../common/header.jsp"%>
<title>产品列表</title>
</head>
<style>
.selected_price{
	background:#999;
}
.selected_comment{
	background:#999;
}
.selected_sale{
	background:#999;
}
</style>
<script>
$(function () {
   
	var price = "${price}";
	if(price == null)
	{
		$(".p_f_name_price a").removeClass('selected_price'); 
		$('#price_0').css('background','#999');
	}
	for(var i=1;i<=6;i++)
	{
		if(price == i)
		{
			$(".p_f_name_price a").removeClass('selected_price');
			$('#price_0').css('background','#FFFFFF');
			$('#price_'+i).addClass('selected_price'); 
		}
	}
	
	
	var sale = "${sale}";
	if(sale == null)
	{
		$(".p_f_name_sale a").removeClass('selected_sale'); 
		$('#sale_0').css('background','#999');
	}
	for(var i=1;i<=6;i++)
	{
		if(sale == i)
		{
			$(".p_f_name_sale a").removeClass('selected_sale');
			$('#sale_0').css('background','#FFFFFF');
			$('#sale_'+i).addClass('selected_sale'); 
		}
	}
	
	
	var comment = "${comment}";
	if(comment == null)
	{
		$(".p_f_name_comment a").removeClass('selected_comment'); 
		$('#comment_0').css('background','#999');
	}
	for(var i=1;i<=6;i++)
	{
		if(comment == i)
		{
			$(".p_f_name_comment a").removeClass('selected_comment');
			$('#comment_0').css('background','#FFFFFF');
			$('#comment_'+i).addClass('selected_comment'); 
		}
	}
	
});

function selected_price(e){
	$(".p_f_name_price a").removeClass('selected_price'); 
	$('.Filter_Entire_price a').css('background','#FFFFFF');
	$(e).addClass('selected_price'); 
}
function selected_price_all(e){
	$(".p_f_name_price a").removeClass('selected_price'); 
	$('.Filter_Entire_price a').css('background','#999');
}


function selected_comment(e){
	$(".p_f_name_comment a").removeClass('selected_comment'); 
	$('.Filter_Entire_comment a').css('background','#FFFFFF');
	$(e).addClass('selected_comment'); 
}
function selected_comment_all(e){
	$(".p_f_name_comment a").removeClass('selected_comment'); 
	$('.Filter_Entire_comment a').css('background','#999');
}



function selected_sale(e){
	$(".p_f_name_sale a").removeClass('selected_sale'); 
	$('.Filter_Entire_sale a').css('background','#FFFFFF');
	$(e).addClass('selected_sale'); 
}
function selected_sale_all(e){
	$(".p_f_name_sale a").removeClass('selected_sale'); 
	$('.Filter_Entire_sale a').css('background','#999');
}

function addMyCollect(i)
{
	var data = $("#add_collect"+i).serialize();
	$.ajax({
		type: "post",
		url: "/TeaShop/home/account/add_collect",
		data: data, 
		dataType: "json", //返回数据类型
		success: function(result){
			if(result.type == 'success'){
				
				$.messager.alert("消息提醒", result.msg, "info");
			}
			else{
				$.messager.alert("消息提醒", result.msg, "warning");
				
			}
			
		}
		
	});
	
}

function addMyCart(i)
{
	
	var URL = window.location.href;
	var data = $("#add_collect"+i).serialize();
	$.ajax({
		type: "post",
		url: "/TeaShop/home/shopping/add_cart",
		data: data, 
		dataType: "json", //返回数据类型
		success: function(result){
			if(result.type == 'success'){
				
				$.messager.alert("消息提醒", result.msg, "info",function(){window.location.href = URL;});
			}
			else{
				$.messager.alert("消息提醒", result.msg, "warning");
				
			}
			
		}
		
	});
	
	
}
</script>
<body>
<%@include file="../common/common_top.jsp"%>

<!--导航栏样式-->
<div id="Menu" class="clearfix">
<div class="Menu_style">
  <div id="allSortOuterbox" class="display">
    <div class="Category"><a href="/TeaShop/home/product/list" class="Menu_img"><em></em></a></div>
    <div class="hd_allsort_out_box_new">
	 <!--左侧栏目开始-->
	 <div class="Menu_list">	
	    <div class="menu_title">茶叶品种</div>
        <c:forEach items="${teaCategoryList}" var="teaCategory">
				<a href="${teaCategory.href}">${teaCategory.name}</a>
			</c:forEach>
	</div>	
    <div class="Menu_list">	
	    <div class="menu_title">茶叶价格</div>
        <a href="/TeaShop/home/product/list?price=1">100以下</a><a href="/TeaShop/home/product/list?price=2">100-200</a>
        <a href="/TeaShop/home/product/list?price=3">200-400</a><a href="/TeaShop/home/product/list?price=4">400-600</a>
        <a href="/TeaShop/home/product/list?price=5">600-1000</a><a href="/TeaShop/home/product/list?price=6">1000以上</a>
	</div>	
     <div class="Menu_list">	
	    <div class="menu_title">推荐茶叶</div>
        <ul class="recommend">
        	<c:set var="count" value="0"></c:set>
            <c:forEach items="${teaListByActionId}" var="tea">
               		<!-- 只允许显示2个 -->
               		<c:if test="${count < 2}">
	         			 	<li><a href="${tea.href}" title="${tea.name}">${tea.name}</a></li>
	               		  	<c:set var="count" value="${count+1}"></c:set>
         			</c:if>
         	</c:forEach>
        </ul>
	</div>	
	</div>		
	</div>
    <div class="Navigation" id="Navigation">
		 <ul class="Navigation_name">
			<li><a class="nav_on" id="mynav"  href="/TeaShop/home/system/index"><span>首页</span></a></li>
			 <c:forEach items="${teaCategoryList}" var="teaCategory">
				<li><a class="nav_on" id="mynav"  href="${teaCategory.href}"><span>${teaCategory.name}</span></a></li>
			 </c:forEach>
		 </ul>			 
		</div>
    <!--购物车-->	
    
     <div class="hd_Shopping_list" id="Shopping_list">
   <div class="s_cart"><em></em><a href="#">我的购物车</a> <i class="ci-right">&gt;</i><i class="ci-count" id="shopping-amount">${cartTotal}</i></div>
   <div class="dorpdown-layer">
       <div class="spacer"></div>
	 <!--<div class="prompt"></div><div class="nogoods"><b></b>购物车中还没有商品，赶紧选购吧！</div>-->
	 <ul class="p_s_list">
	 
	 	 <c:set var="totalPrice" value="0"></c:set>
 		 <c:forEach items="${cartList}" var="cart" varStatus="vs">
			  <li>
			    <div class="img"><img src="${cart.tea.photo}" style="width:40px;height:40px;"></div>
			    <div class="content">
			      <p><a href="${cart.tea.href}">${cart.tea.name}</a></p><p>${cart.tea.info}</p>
			    </div>
				<div class="Operations">
				<p class="Price">￥${cart.tea.new_price}</p>
				<p>数量：${cart.num}</p></div>
			  </li>
			   <c:set var="totalPrice" value="${totalPrice+cart.tea.new_price*cart.num}"></c:set>
		 </c:forEach>
		  
	</ul>		
	 <div class="Shopping_style">
	 <div class="p-total">共<b>${cartTotal}</b>件商品　共计<strong>￥ ${totalPrice}</strong></div>
	  <a href="/TeaShop/home/shopping/cart" title="去购物车结算" id="btn-payforgoods" class="Shopping">去购物车结算</a>
	 </div>	 
   </div>	
  </div>
</div>
</div>
<!--内页样式-->
 <div class="Inside_pages">
    <div class="products">
    <!--当前位置（面包屑）-->
     <div class="Location_link">
     <em></em><a href="/TeaShop/home/product/list">全部商品</a> 
     
	     <c:forEach items="${teaCategoryList}" var="teaCategory">
	     	<c:if test="${teaCategory.id == categoryId}">
	     		<a href="/TeaShop/home/product/list?categoryId=${categoryId}">&lt;${teaCategory.name}</a>  
	     	</c:if>
	     </c:forEach>
     
     
     
     </div>
    <!--筛选条件样式-->
      <div class="products_Select marginbottom">
       <div class="Filter">
  <div class="Filter_list clearfix">
   <div class="Filter_title"><span>销量：</span></div>
   <div class="Filter_Entire_sale"><a id="sale_0" href="/TeaShop/home/product/list?sale=0" onclick="selected_sale_all(this)" href="javascript:void(0)">全部</a></div>
   <div class="p_f_name_sale">
    <a id="sale_1" href="/TeaShop/home/product/list?sale=1" onclick="selected_sale(this)" href="javascript:void(0)">0-200</a>  
	<a id="sale_2" href="/TeaShop/home/product/list?sale=2" onclick="selected_sale(this)" href="javascript:void(0)">200-600</a> 
	<a id="sale_3" href="/TeaShop/home/product/list?sale=3" onclick="selected_sale(this)" href="javascript:void(0)">600-1200</a>  
	<a id="sale_4" href="/TeaShop/home/product/list?sale=4" onclick="selected_sale(this)" href="javascript:void(0)">1200-2000</a> 
	<a id="sale_5" href="/TeaShop/home/product/list?sale=5" onclick="selected_sale(this)" href="javascript:void(0)">2000-3000</a> 
	<a id="sale_6" href="/TeaShop/home/product/list?sale=6" onclick="selected_sale(this)" href="javascript:void(0)">3000以上</a>  
   </div>
  </div>
  <div class="Filter_list clearfix">
  <div class="Filter_title"><span>评论量：</span></div>
  <div class="Filter_Entire_comment"><a id="comment_0" href="/TeaShop/home/product/list?comment=0" onclick="selected_comment_all(this)" href="javascript:void(0)">全部</a></div>
  <div class="p_f_name_comment">
  	<a id="comment_1" href="/TeaShop/home/product/list?comment=1" onclick="selected_comment(this)" href="javascript:void(0)">0-50</a>
  	<a id="comment_2" href="/TeaShop/home/product/list?comment=2" onclick="selected_comment(this)" href="javascript:void(0)">50-150</a>
  	<a id="comment_3" href="/TeaShop/home/product/list?comment=3" onclick="selected_comment(this)" href="javascript:void(0)">150-300</a>
  	<a id="comment_4" href="/TeaShop/home/product/list?comment=4" onclick="selected_comment(this)" href="javascript:void(0)">300-500</a>
  	<a id="comment_5" href="/TeaShop/home/product/list?comment=5" onclick="selected_comment(this)" href="javascript:void(0)">500-750</a>
	<a id="comment_6" href="/TeaShop/home/product/list?comment=6" onclick="selected_comment(this)" href="javascript:void(0)">750以上</a>
  </div>
  </div>
  <div class="Filter_list clearfix">
  <div class="Filter_title"><span>价格：</span></div>
  <div class="Filter_Entire_price"><a id="price_0" href="/TeaShop/home/product/list?price=0" onclick="selected_price_all(this)" href="javascript:void(0)">全部</a></div>
  <div class="p_f_name_price">
    <a id="price_1" href="/TeaShop/home/product/list?price=1" onclick="selected_price(this)" href="javascript:void(0)">100以下</a>
    <a id="price_2" href="/TeaShop/home/product/list?price=2" onclick="selected_price(this)" href="javascript:void(0)">100-200</a>
    <a id="price_3" href="/TeaShop/home/product/list?price=3" onclick="selected_price(this)" href="javascript:void(0)">200-400</a>
    <a id="price_4" href="/TeaShop/home/product/list?price=4" onclick="selected_price(this)" href="javascript:void(0)">400-600</a>
    <a id="price_5" href="/TeaShop/home/product/list?price=5" onclick="selected_price(this)" href="javascript:void(0)">600-1000</a>
    <a id="price_6" href="/TeaShop/home/product/list?price=6" onclick="selected_price(this)" href="javascript:void(0)">1000以上</a>
  </div>
  </div>
 </div>
      </div>
      <!--产品列表列表-->
      <div class="products_list marginbottom">

 <!--产品列表样式-->
 <div class="p_list  clearfix">
   <ul>
   <c:forEach items="${teaList}" var="tea" varStatus="vs">
   	  
	    <li class="gl-item">
	    	<form id="add_collect${vs.count}" method="post">
	    		<!-- 向后台传递数据 -->
	    		<input type="hidden" name="photo" value="${tea.photo}">
	    		<input type="hidden" name="name" value="${tea.name}">
	    		<input type="hidden" name="accountId" value="${account.id}">
	    		<input type="hidden" name="price" value="${tea.new_price}">
	    		<input type="hidden" name="productId" value="${tea.id}">
	    		<input type="hidden" name="num" value="1">
	    		
	    		
				<div class="Borders">
				 <div class="img"><a href="${tea.href}"><img src="${tea.photo}"  style="width:220px;height:220px"/></a></div>	 
				 <div class="name"><a href="${tea.href}">${tea.name}</a></div>
			     <div class="Price">商城价：<b>¥${tea.new_price}</b><span>原价：<em>${tea.pre_price}</em></span></div>
				 <div class="Review">
				 
				 		<span style="float:left">已有<font color="red">${tea.commentNumber}</font>评论</span>
				 		<span style="float:right">已售<font color="red">${tea.saleNumber}</font>份</span>
				 
				 </div>
				 <br>
				 <div class="p-operate">
				  	<a href="javascript:void(0)" onclick="addMyCollect(${vs.count});" class="p-o-btn Collect"><em></em>收藏</a>
				  	<a href="javascript:void(0)" onclick="addMyCart(${vs.count});" class="p-o-btn shop_cart"><em></em>加入购物车</a>
				 </div>
				 </div>
				 
		    </form>
		</li>
	  
	</c:forEach>
   </ul>
   <!-- 分页 -->
   <div class="Paging_style">
   	 <!-- 上一页 -->
   	 <c:if test="${currentPage != 1}">
     	<a href="/TeaShop/home/product/list?page=${currentPage-1}&rows=15&categoryId=${categoryId}&flag=1">&lt;上一页</a>
     </c:if>
     <c:if test="${currentPage == 1}">
     	<a href="#">没有上一页了</a>
     </c:if>
     
     <!-- 中间部分 -->
     <c:forEach begin="1" end="${totalPage}" step="1" var="item">
     	
		<c:if test="${item == currentPage-2}">
		 		<a href="/TeaShop/home/product/list?page=${item}&rows=15&categoryId=${categoryId}&flag=1">${item}</a>
		</c:if>
		<c:if test="${item == currentPage-1}">
		 		<a href="/TeaShop/home/product/list?page=${item}&rows=15&categoryId=${categoryId}&flag=1">${item}</a>
		</c:if>
		<c:if test="${item == currentPage}">
		 	<a href="/TeaShop/home/product/list?page=${item}&rows=15&categoryId=${categoryId}&flag=1" class="on">${item}</a>
		</c:if>
		<c:if test="${item == currentPage+1}">
		 		<a href="/TeaShop/home/product/list?page=${item}&rows=15&categoryId=${categoryId}&flag=1">${item}</a>
		</c:if>
		<c:if test="${item == currentPage+2}">
		 		<a href="/TeaShop/home/product/list?page=${item}&rows=15&categoryId=${categoryId}&flag=1">${item}</a>
		</c:if>
	 </c:forEach>
	 
	 
	 <!-- 下一页 -->
	 <c:if test="${currentPage != totalPage}">
	 	<a href="/TeaShop/home/product/list?page=${currentPage+1}&rows=15&categoryId=${categoryId}&flag=1">下一页&gt;</a>
	 </c:if>
	 <c:if test="${currentPage == totalPage}">
	 	<a href="#">没有下一页了</a>
	 </c:if>
	 
	 <a href="/TeaShop/home/product/list?page=${totalPage}&rows=15&categoryId=${categoryId}&flag=1">尾页</a>
	<span class="p-skip"><em>共<b>${totalPage}</b>页&nbsp;&nbsp;</em></span>
   </div>
 </div>
      </div>
      <!--分页样式-->
    <div class="Paging marginbottom">
    
    </div>
    </div>
</div>    
<%@include file="../common/footer.jsp"%>
</body>
</html>
